package me.yiyou.meihua.ui.page.record

import androidx.compose.foundation.Image
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.width
import androidx.compose.foundation.lazy.LazyColumn
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.runtime.getValue
import androidx.compose.runtime.livedata.observeAsState
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp
import androidx.lifecycle.viewmodel.compose.viewModel
import me.yiyou.meihua.R
import me.yiyou.meihua.data.BaGuaImage
import me.yiyou.meihua.element.CustomButton
import me.yiyou.meihua.utils.getGuaNameByImgShang
import me.yiyou.meihua.utils.getGuaNameByImgXia

@Composable
fun RecordPage(viewModel: RecordViewModel = viewModel()) {

    var baGuaImage: BaGuaImage? = null
    var huGuaImage: BaGuaImage? = null
    var bianGuaImage: BaGuaImage? = null

    // 上下卦，动爻数据
    val shangGua by viewModel.shangGua
    val xiaGua by viewModel.xiaGua
    val dongYao by viewModel.dongYao

    // 位置下标
    val position by viewModel.position

    // 所有记录,直接暴漏
    val lunarDates by viewModel.allList.observeAsState(emptyList())

    LazyColumn(Modifier.fillMaxWidth()) {
        if (lunarDates.isNotEmpty()) {
            viewModel.qiGua(lunarDates[position])
        }
        item {
            // 卦象部分
            Row(
                modifier = Modifier
                    .fillMaxWidth()
                    .padding(top = 60.dp, start = 10.dp, end = 10.dp),
                horizontalArrangement = Arrangement.SpaceBetween,
                verticalAlignment = Alignment.CenterVertically
            ) {
                // 本卦部分
                Column(Modifier.width(100.dp)) {
                    baGuaImage = viewModel.paintGua(shangGua, xiaGua)
                    if (dongYao == 6) GetSingleYao(
                        baGuaImage!!.six, true
                    ) else GetSingleYao(baGuaImage!!.six)

                    if (dongYao == 5) GetSingleYao(
                        baGuaImage!!.five, true
                    ) else GetSingleYao(baGuaImage!!.five)

                    if (dongYao == 4) GetSingleYao(
                        baGuaImage!!.four, true
                    ) else GetSingleYao(baGuaImage!!.four)

                    if (dongYao == 3) GetSingleYao(
                        baGuaImage!!.three, true
                    ) else GetSingleYao(
                        baGuaImage!!.three
                    )

                    if (dongYao == 2) GetSingleYao(
                        baGuaImage!!.two, true
                    ) else GetSingleYao(baGuaImage!!.two)

                    if (dongYao == 1) GetSingleYao(
                        baGuaImage!!.one, true
                    ) else GetSingleYao(baGuaImage!!.one)
                }
                // 互卦
                Column(Modifier.width(100.dp)) {
                    huGuaImage = getHuGuaImageMethod(baGuaImage!!)
                    GetSingleYao(huGuaImage!!.six)
                    GetSingleYao(huGuaImage!!.five)
                    GetSingleYao(huGuaImage!!.four)
                    GetSingleYao(huGuaImage!!.three)
                    GetSingleYao(huGuaImage!!.two)
                    GetSingleYao(huGuaImage!!.one)
                }
                // 变卦
                Column(Modifier.width(100.dp)) {
                    bianGuaImage =
                        getBianGuaImageMethod(baGuaImage!!, dongYao)
                    GetSingleYao(bianGuaImage!!.six)
                    GetSingleYao(bianGuaImage!!.five)
                    GetSingleYao(bianGuaImage!!.four)
                    GetSingleYao(bianGuaImage!!.three)
                    GetSingleYao(bianGuaImage!!.two)
                    GetSingleYao(bianGuaImage!!.one)
                }
            }

            // 分析部分
            Column(
                Modifier
                    .fillMaxWidth()
                    .padding(top = 20.dp, start = 10.dp, end = 10.dp),
                horizontalAlignment = Alignment.CenterHorizontally,
                verticalArrangement = Arrangement.Center
            ) {
                Text(
                    text = "主卦: ${getGuaNameByImgShang(baGuaImage!!)} + ${
                        getGuaNameByImgXia(
                            baGuaImage!!
                        )
                    } + ${dongYao}爻动 ", fontSize = 18.sp
                )
                Text(
                    text = "互卦: ${getGuaNameByImgShang(huGuaImage!!)} + ${
                        getGuaNameByImgXia(
                            huGuaImage!!
                        )
                    } ", fontSize = 18.sp
                )
                Text(
                    text = "变卦: ${getGuaNameByImgShang(bianGuaImage!!)} + ${
                        getGuaNameByImgXia(
                            bianGuaImage!!
                        )
                    } ", fontSize = 18.sp
                )
            }

            // 时间部分
            Column(
                Modifier
                    .fillMaxWidth()
                    .padding(top = 20.dp, start = 10.dp, end = 10.dp)
            ) {
                Text(text = "起卦时间: ${viewModel.time}", fontSize = 16.sp, color = Color.Gray)
                Text(text = "占问事: ${viewModel.content}", fontSize = 16.sp, color = Color.Gray)
            }

            Row(
                modifier = Modifier
                    .padding(10.dp)
                    .fillMaxWidth(),
                horizontalArrangement = Arrangement.Center
            ) {
                CustomButton(
                    text = "上一卦",
                    onClick = { viewModel.previousGua() },
                    modifier = Modifier.width(100.dp)
                )
                Spacer(modifier = Modifier.width(10.dp))
                CustomButton(
                    text = "下一卦",
                    onClick = { viewModel.nextGua() },
                    modifier = Modifier.width(100.dp)
                )
            }
        }
    }
}

/**
 * 画变卦,根据本卦计算互卦
 */
fun getBianGuaImageMethod(baGuaImage: BaGuaImage, dong: Int): BaGuaImage {
    val final = BaGuaImage(
        six = baGuaImage.six,
        five = baGuaImage.five,
        four = baGuaImage.four,
        three = baGuaImage.three,
        two = baGuaImage.two,
        one = baGuaImage.one
    )
    if (dong == 6) {
        final.six = !final.six
    }
    if (dong == 5) {
        final.five = !final.five
    }
    if (dong == 4) {
        final.four = !final.four
    }
    if (dong == 3) {
        final.three = !final.three
    }
    if (dong == 2) {
        final.two = !final.two
    }
    if (dong == 1) {
        final.one = !final.one
    }
    return final
}

/**
 * 画互卦,根据本卦计算互卦
 */
fun getHuGuaImageMethod(baGuaImage: BaGuaImage): BaGuaImage {
    return BaGuaImage(
        six = baGuaImage.five,
        five = baGuaImage.four,
        four = baGuaImage.three,
        three = baGuaImage.four,
        two = baGuaImage.three,
        one = baGuaImage.two
    )
}

/**
 * 画卦,单爻
 */
@Composable
fun GetSingleYao(bol: Boolean, dong: Boolean? = false) {
    Row(
        Modifier.fillMaxWidth(),
        horizontalArrangement = Arrangement.Center,
        verticalAlignment = Alignment.CenterVertically
    ) {
        if (dong!!) {
            Text(text = "○", modifier = Modifier.width(10.dp))
        } else {
            Text(text = "", modifier = Modifier.width(10.dp)) // 占位符
        }
        Image(
            painter = painterResource(id = if (bol) R.mipmap.yangyao else R.mipmap.yinyao),
            contentDescription = null,
            modifier = Modifier.width(90.dp)
        )
    }
}